<template>
    <div class="home">
        <!-- asider -->
        <home-asider></home-asider>
        <!-- 内容区域、嵌套布局 -->
        <home-content>
            <!-- m命名插槽，可以独立为layout -->
            <template v-slot:header>
                <home-header></home-header>
            </template>            
            <template v-slot:content>
                <router-view></router-view>
            </template>
        </home-content>
    </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import HomeAsider from "./home-asider.vue"
import HomeContent from "./home-content.vue"
import HomeHeader from './home-header.vue'

export default defineComponent({
    setup() {
        
    },
    name:"Home",
    data(){
        return {
            msg:"this is home index"
        }
    },
    components:{
        HomeAsider,HomeHeader,HomeContent
    }
})
</script>

<style lang="less" scoped>
    .home{
        width: 100%;
        height: 100%;
        display: flex;
    }
</style>